html
<template>
  <div class="component">
    <template v-if="Array.isArray(content)">
      <!-- content 是数组的处理 -->
      <img :src="content[0]?.url" alt="请上传图片" v-if="content[0]?.url" />
    </template>
  </div>
</template>

<script lang="ts">
import {defineComponent, PropType, watch, ref} from 'vue';

export default defineComponent({
  name: 'Picture',
  props: {
    id: {
      type: String as PropType<string>,
      default: "0000"
    },
    valueFromParent: {
      type: Object as PropType<Object>,
      required: true,
      default: {}
    },
  },
  setup(props) {
    const content = ref(props.valueFromParent?.moduleValue?.value);
    watch(()=>props.valueFromParent,(newVal)=>{
      content.value = newVal.moduleValue?.value
    },{deep:true})
    return{
      content,
    }
  }

});

</script>

<style scoped>
.component {
  /* 样式 */
  color: white;
  border: 1px solid #ff8d1a;
  width: 345px;
  min-height: 40px;
  margin-top: 20px;
  background-color: #232323;
  border-radius: 10px;
  overflow:hidden;
  img{
    border-radius: 10px;
    width: 345px;
    height: 221px;

  }
}
</style>
